<template>
    <div id="">
        <SlotVue>
            <template v-slot:header>
                <div>
                    header
                </div>
            </template>
            <!-- 'v-slot:'可以简写为'#' -->
            <template #main="{ data }">
                <div>
                    {{ data.id }}-{{ data.name }}-{{ data.age }}
                </div>
            </template>
            <!-- 动态插槽 -->
            <template #[name]>
                <div>
                    footer
                </div>
            </template>
        </SlotVue>
    </div>
</template>

 <script setup lang="ts">
import { ref } from 'vue'
import SlotVue from './Slot.vue';

let name = ref('footer')

</script>

<style lang="less" scoped>
</style>